<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/plugins/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/css/global.css" media="all">
    <link rel="stylesheet" href="/plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="/css/table.css"/>
    <title>交易对、交易所列表</title>
    <style type="text/css">
        .searcheBottom{margin-bottom: 10px;}
        body{overflow-y: scroll;}
    </style>
</head>
<body class="admin-main">
<blockquote class="layui-elem-quote">
    <div class="demoTable">
        <div class="layui-inline searcheBottom">
            <div class="layui-inline" style="margin-right: 30px;">
                <h3><b>当前货币名称：${coinNameCn!}</b></h3>
                <input id="currencyId" class="layui-input" autocomplete="off" value="${currencyId!}" style="display: none;"/>
            </div>
        </div>
        <div class="layui-inline searcheBottom">
            交易所名称：
            <div class="layui-inline">
                <input id="exchangeName" class="layui-input" name="exchangeName" autocomplete="off" placeholder="交易所名称"/>
            </div>
        </div>
        <div class="layui-inline searcheBottom">
            交易对名称：
            <div class="layui-inline">
                <input id="transactionAlias" class="layui-input" name="transactionAlias" autocomplete="off" placeholder="交易对名称"/>
            </div>
        </div>
        <div class="layui-inline searcheBottom">
            <button class="layui-btn" data-type="reload" id="search" >搜索</button>
            <a class="layui-btn layui-btn-primary" id="reset">重置</a>
            <button id="traadd" class="layui-btn"><i class="layui-icon">&#xe608;</i>添加</a></button>
            <a class="layui-btn layui-btn-primary" href="/manage/currency/webCurTra?id=${currencyId!}&coinNameCn=${coinNameCn!}&symbol=${symbol!}" >返回</a>
        </div>
    </div>
</blockquote>
<span style="font-size: 16px;"><b>交易对、交易所列表(web)</b></span>
<table class="layui-hide" id="exchangeTraTable" lay-filter="tableFilter"></table>
</div>
<script type="text/javascript" src="/plugins/layui/layui.js"></script>
<script>
    layui.use(['jquery','table','laydate','layer','form','util'],function(){
        var $=layui.jquery,table=layui.table,laydate = layui.laydate,
            layer = layui.layer,form = layui.form,util=layui.util;
        var symbol = "${symbol!}";
        pageInit();
        //表格渲染
        function pageInit(){
            table.render({
                elem:"#exchangeTraTable",
                url:"/manage/currency/selExchangeTra",
                where:{symbol:symbol},
                method:"post",
                cols:[[
                    {type:'checkbox'},
                    {field:'id', title: 'ID', sort: true,align:'center'},
                    {field:'exchangeName', title: '交易所',align:'center'},
                    {field:'transactionAlias', title: '交易对',align:'center'}
                ]],
                limits:[10,15,20,25,30],
                limit:10,
                page:true
            });
        };

        var active = {
            reload: function () {
                var exchangeName = $('#exchangeName');
                var transactionAlias = $('#transactionAlias');
                table.reload('exchangeTraTable', {
                    where: {
                        exchangeName: exchangeName.val(),
                        transactionAlias: transactionAlias.val()
                    }
                });
            }
        };

        //将搜索框的值随请求传到后台
        $('.demoTable #search').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });

        $(".layui-input").keydown(function (e) {
            if(e.keyCode == 13){
                $('#search').click();
            }
        });

        //重置
        $("#reset").on("click",function(){
            exchangeName.value = '';
            transactionAlias.value='';
        });

        var currencyId = "${currencyId!}";
        var size = "${size!}";
        $('#traadd').on('click', function(){
            var checkStatus = table.checkStatus('exchangeTraTable')
                ,data = checkStatus.data;
            if(data.length < 1){
                layer.msg('请选择数据', { icon: 7, shift: 6 });
            }else if(data.length > 1){
                layer.msg('只能选择一个', { icon: 7, shift: 6 });
            } else {
                var etmId = data[0].id;
                if(size > 0){
                    layer.confirm("当前货币已有一个关联的交易对，是否替换？",{
                        btn:["确定","取消"]
                    },function () {
                        $.ajax({
                            url:"/manage/currency/addCurrencyTra",
                            type:"post",
                            data:{"etmId":etmId,"currencyId":currencyId},
                            dataType:"json",
                            success:function (res) {
                                if(res.code ==0){
                                    layer.msg(res.msg, { icon: 6, shift: 6 });
                                    pageInit();
                                }
                            }
                        });
                    });
                }else{
                    $.ajax({
                        url:"/manage/currency/addCurrencyTra",
                        type:"post",
                        data:{"etmId":etmId,"currencyId":currencyId},
                        dataType:"json",
                        success:function (res) {
                            if(res.code ==0){
                                layer.msg(res.msg, { icon: 6, shift: 6 });
                                pageInit();
                            }
                        }
                    });
                }
            }
        })
    });
</script>

</body>
</html>